import { resolveComponent } from 'vue'
import { fliterDataWrapper, fliterDouDataWrapper  } from 'common/js/table'
import { areaList } from 'common/js/modules'
import pumpCloseImg from '../img/pumpClose.png'
import pumpOpenImg from '../img/pumpOpen.png'

const areaArr = areaList()
export const columns = (that) => {
  return [
    {
      key: 'stcd',
      align: 'center',
      width: 120,
      title: '泵站编码',
      render: (h, params) => {
        const { row } = params

        return fliterDataWrapper(h, row, 'stcd')
      }
    },
    {
      key: 'stnm',
      align: 'center',
      title: '泵站名称',
      render: (h, params) => {
        const { row } = params

        return fliterDataWrapper(h, row, 'stnm')
      }
    },
    {
      key: 'area',
      title: '所属区域',
      align: 'center',
      render: (h, params) => {
        const { row } = params
        const addvcdName = areaArr.find(item => item.value === row.addvcd) || {}

        return h('div', {}, [
          h('div', { }, addvcdName.label),
          h('div', { }, row['zhenName'])
        ])
      }
    },
    {
      key: 'area',
      title: '所属区域编码',
      align: 'center',
      render: (h, params) => {
        const { row } = params

        return h('div', {}, [
          h('div', { }, row['addvcd']),
          h('div', { }, row['zhenCode'])
        ])
      }
    },
    {
      key: 'sw',
      title: '泵站开启情况',
      width: 150,
      render: (h, params) => {
        const { row } = params
        const { wc } = row

        const imgArr = []

        if (wc && wc.num && wc.num > 0) {
          for (let i = 1; i <= wc.num; i++) {
            const isOpen = wc[`runCondPG#${i}`] == '运行'
            
            imgArr.push(
              h('img', {
                src: isOpen ? pumpOpenImg : pumpCloseImg
              })
            )
          }
        } else {
          imgArr.push(h('span', {}, '--'))
        }
        
        return h('div', {}, imgArr)
      }
    },
    {
      key: 'tm',
      align: 'center',
      title: '监测时间',
      render: (h, params) => {
        const { row } = params

        return fliterDouDataWrapper(h, row, 'wc.tm')
      }
    },
    {
      key: 'status',
      align: 'center',
      title: '状态',
      render: (h, params) => {
        const { row } = params
        const status = row.status
        let color = '#19be6b' // 默认绿色

        // 根据状态设置不同颜色
        if (status === '延迟1小时') {
          color = '#ff9900'
        } else if (status === '延迟3小时') {
          color = '#ff7700'
        } else if (status === '延迟12小时') {
          color = '#ff5500'
        } else if (status === '延迟1天') {
          color = '#ff3300'
        } else if (status === '延迟3天') {
          color = '#ff1100'
        } else if (status === '延迟7天以上' || status === '数据缺失') {
          color = '#ed4014'
        }

        return h('span', { style: { color } }, row.status || '--')
      }
    },
    {
      key: '__custom_source',
      align: 'center',
      title: '数据来源',
      render: (h, params) => {
        const { row } = params

        return fliterDataWrapper(h, row, '__custom_source')
      }
    },
    // {
    //   key: 'action',
    //   title: '操作',
    //   width: 70,
    //   align: 'center',
    //   render: (h, params) => {
    //     const { row } = params
        
    //     const list = [
    //       { text: '详情', type: 'primary', clickFn: () => { that.resetPsd(row) } }
    //     ]

    //     return h(resolveComponent('TableButton'), {
    //       list
    //     })
    //   }
    // }
  ]
}

export const sourceList = () => [
  { value: '物联网平台', label: '物联网平台' },
  { value: '镇街水利所', label: '镇街水利所' }
]
